// 媒体查询混合
@mixin mobile {
  @media (max-width: 768px) {
    @content;
  }
}

@mixin tablet {
  @media (min-width: 769px) and (max-width: 1024px) {
    @content;
  }
}

@mixin desktop {
  @media (min-width: 1025px) {
    @content;
  }
}

// 弹性盒子混合
@mixin flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

@mixin flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

// 文本截断
@mixin text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

// 按钮样式混合
@mixin button-reset {
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
}

@mixin button-primary {
  @include button-reset;
  background-color: $primary-color;
  color: $white;
  padding: $spacing-sm $spacing-lg;
  border-radius: $border-radius;
  font-weight: 500;
  transition: all 0.2s ease;

  &:hover:not(:disabled) {
    background-color: $primary-hover;
    transform: translateY(-1px);
    box-shadow: $shadow-md;
  }

  &:disabled {
    background-color: $gray-400;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
  }
}

// 卡片样式混合
@mixin card {
  background-color: $white;
  border-radius: $border-radius;
  box-shadow: $shadow-sm;
  padding: $spacing-md;
}